﻿body
{
    background-color: Black;
    font: normal normal normal small/1em Verdana;
}

.container
{
    width: 996px;
    color: White;
    margin: 0 auto;
}
.mainmenulink
{
    color: White;
    font-size: small;
    font-weight: bold;
    font-variant: small-caps;
    text-decoration: none;
    text-align: center;
    margin: 0 auto;
}
.mainmenulink:hover
{
    cursor: pointer; cursor: hand;
}

.tb
{
    position: relative;
    background-image: url(../img/tb.png);
    background-repeat: repeat-x;
    width: 800px; height: 40px;
    margin: 30px auto 0px auto;
}

.tb .left, .tb .right, .tb .leftbutton, .tb .rightbutton
{
    width: 50px; height: 40px;
    position: absolute;
}
.tb .tb_button
{
    width: 300px; height: 40px; left: 250px;
    position: absolute;
}
.tb .left { background-image: url(../img/tb_left.png); left: 0px;}
.tb .leftbutton { background-image: url(../img/tb_leftarrow.png); left: 0px;}
.tb .leftbutton:hover { background-image: url(../img/tb_leftarrowselected.png); left: 0px; cursor: pointer; cursor: hand; }
.tb .tb_button:hover { cursor: pointer; cursor: hand; }
.tb #mtc_tb { background-image: url(../img/mtc/tb.png); }
.tb #hki_tb { background-image: url(../img/hki/tb.png); }
.tb #hml_tb { background-image: url(../img/hml/tb.png); }
.tb #kpo_tb { background-image: url(../img/kpo/tb.png); }
.tb #esp_tb { background-image: url(../img/esp/tb.png); }
.tb #oul_tb { background-image: url(../img/oul/tb.png); }
.tb .right { background-image: url(../img/tb_right.png); left: 750px; }
.tb .rightbutton { background-image: url(../img/tb_rightarrow.png); left: 750px; }
.tb .rightbutton:hover { background-image: url(../img/tb_rightarrowselected.png); left: 750px; cursor: pointer; cursor: hand; }

.tb .startDate, .tb .endDate
{
    width: 200px; height: 20px;
    position: absolute;
    color: White;
    font: normal normal normal smaller Verdana;
    text-align: center;
}
.tb .startDate { left: 50px; top: 13px; }
.tb .endDate { left: 550px; top: 13px; }



.menubar
{
    background: Black url(../img/menubkg.png) repeat-x top;
    margin: 25px auto 0px auto;
    color: White;
    height: 30px; width: 800px;
}
.mb_left
{
    background: transparent url(../img/menubkgleftend.png) no-repeat left top;
    padding-left: 25px;
}
.mb_right
{
    background: transparent url(../img/menubkgrightend.png) no-repeat right top;
    padding-right: 25px;
}
.mb_main
{
}

.mb_main table
{
    margin: 0px auto 0px auto;
    padding: 0px;
}

.mb_main table tr td
{
    font-family: Arial;
    font-size: 12px;
    text-align: center;
    width: 20%;
    height: 30px;
}

.mb_tab
{
    height: 30px;
}
.mb_tab_highlighted
{
    background: transparent url(../img/menubuttonhighlighted.png) no-repeat center top;    
    cursor: pointer; cursor: hand;
}

.mb_tab_selected
{
    background: transparent url(../img/menubuttonselected.png) no-repeat center top;
}

.mb_text
{
    padding-top: 5px;
}

#content_frame
{
    position: relative;
    margin: 0 auto;
    height: 600px; width: 800px;
    border: solid 2px White;
}

.content_container
{
    position: absolute;
    top: 0px; left: 0px;
    height: 600px; width: 800px;   
}

/* ----------------------- Details ----------------------- */
/* { */
#details_container
{
}

    #detailsMain
    {
        position: relative;
	    width: 800px; height: 600px;
        color: White;
        text-align: center;
        font: normal normal normal small Arial;
    }

    .title
    {
	    font-size: 20px;
	    font-weight: bold;
	    text-decoration: underline;
    }

    .dataTop
    {
	    font-size: 15px;
    }

    .dataBottom
    {
	    font-size: 12px;
    }

    #topLeft
    {
        position: absolute;
        width: 300px; height: 200px;
        top: 100px; left: 0px;
    }
        
    #topMiddle
    {
        position: absolute;
        width: 300px; height: 50px;
        top: 30px; left: 250px;
    }
        #nameFinnish
        {
            font-size: 25px;
            font-weight: bold;
        }
        #nameSwedish
        {
            font-size: 15px;
        }
        
    #topRight
    {
        position: absolute;
        width: 300px; height: 200px;
        top: 100px; right: 0px;
    }
        .link
        {
            color: inherit;
		    text-decoration: underline;
	    }
	    .link:visited
	    {
            color: inherit;
	    }
        
    #bottomLeft
    {
        position: absolute;
        width: 300px; height: 150px;
        top: 425px; left: 0px;
        color: Black;
    }

    #bottomMiddle
    {
        position: absolute;
        width: 300px; height: 100px;
        top: 500px; left: 250px;
        color: Black;
    }

    #bottomRight
    {
        position: absolute;
        width: 300px; height: 150px;
        top: 425px; right: 0px;
        color: Black;
    }
/* } */

/* ----------------------- Stories ----------------------- */
/* { */
#stories_container
{
    background: #0054A2 url(../img/storiesbkg.png) repeat-y;
}
    #storiesMain
    {
        overflow: auto;
        width: 800px; height: 600px;
    }

	    #storyTitles
	    {
	        float: left;
		    width: 220px; margin-top: 25px;
	    }
    	
		    .storyTitle
		    {
                padding-left: 15px; padding-top: 32px;
			    width: 205px; height: 48px;
			    margin: 5px 0px 5px 0px;
			    color: #02243C;
		    }
    		
		    .selectedStoryTitle
		    {
			    background-image: url(../img/storiesbutton.png);
			    color: White;
		    }
    	
			    .storyTitleText
			    {
				    width: 205px; height: 20px;
				    text-align: center;
				    font-size: 15px;
				    font-weight: bolder;
			    }
			    .storyTitleText:hover
			    {
				    cursor: pointer; cursor: hand;
			    }
    			
	    #storyTextContainer
	    {
	    	float: left;
	        margin-top: 25px;
	        width: 560px;
		    padding-bottom: 50px;
	    }
	        #storyText
	        {
	        	clear: both;
	        	width: 500px;
	        	margin: 0 auto;
	        	text-align: justify;
	        	font: normal normal normal 15px Arial;
	        }
/* } */

/* ----------------------- Pictures ----------------------- */
/* { */
#pictures_container
{
}
    #picturesMain
    {
	    width: 800px; height: 600px;
    }
    
    #thumbnailsWindow
    {
        width: 800px; height: 100px;
        overflow: hidden;
    }
        #thumbnails
        {
	        height: 100px;
        }

        .thumbnail
        {
	        margin: 5px; padding: 5px;
            background-color: Black;
            opacity: .5;
        }
        .thumbnail:hover
        {
	        cursor: pointer;
        }

        .thumbnailimage
        {
	        height: 75px;
            border: solid 1px White;
        }

    #imagesWindow
    {
        position: relative;
        width: 800px; height: 500px;
    }
    
        #imageArrowLeft
        {
            width: 40px; height: 500px;
            background: transparent url(../img/arrow_l.png) no-repeat center;
        }
        #imageArrowLeft:hover { cursor: pointer; }
        
        #imageContainers
        {
            width: 720px; height: 500px;
        }
            .imageContainer
            {
                position: absolute;
                width: 720px; height: 500px;
                top: 0px; left: 40px;
                display: none;
                text-align: center;
                padding: 16px 0px 0px 0px;
            }
				.imageContainer img
                {
                    margin: 0px auto;
					display: inline;
                    height: 460px;
                    max-width: 700px;
                    box-shadow: 0px 0px 15px black;
                    border-radius: 10px;
                }
                
        #imageArrowRight
        {
            width: 40px; height: 500px;
            background: transparent url(../img/arrow_r.png) no-repeat center;
        }
        #imageArrowRight:hover { cursor: pointer; }
/* } */

/* ----------------------- Map ----------------------- */
/* { */
#map_container
{
	background: Black url(../img/loading.gif) no-repeat center;
}
    .veMap
    {
    	position: relative;
	    width: 800px; height: 600px;
    }
/* } */

/* ----------------------- FAQ ----------------------- */
/* { */
#faq_container
{
	background-color: #444;
}
    #faq
    {
    	height: 600px; width: 800px;
    	overflow: auto;
    }
        .faqTitle
        {
        	margin: 20px auto;
	        font: normal normal normal 30px Verdana;
	        color: #39C;
	        width: 700px;
	        text-align: center;
        }

        .faqs
        {
	        width: 700px;
	        margin: 0px auto;
        }

	        .question
	        {
		        background-color: #333;
		        background-image: url(../img/questionbkg.png);
		        margin: 10px 0px 10px 0px;
		        height: 25px; width: 700px;
	        }

		        .questionNumber
		        {
		        	float: left;
		        	padding: 3px 10px;
			        color: #39C;
			        font: normal normal bold 13px Verdana;
		        }
        		
		        .questionText
		        {
		        	float: left;
		        	padding: 5px 0px;
			        color: #CCC;
			        font: normal normal normal 10px Verdana;
		        }
        		
		        .showhide
		        {
		        	float: right;
		        	padding: 5px 10px;
			        color: #39C;
			        font: normal normal normal 10px Verdana;
		        }
		        .showhide:hover
		        {
		        	color: White;
			        cursor: pointer; cursor: hand;
		        }

	        .answer
	        {
	        	clear: both;
		        width: 600px;
		        margin: 0px auto 20px auto;
		        color: #CCC;
		        font: normal normal normal 14px Verdana;
		        text-align: justify;
	        }
/* } */

.content
{
    height: 600px; width: 800px;
}


.lbOverlay
{
    background-color: White;
    height: 500px;
    left: 0; top: 0;
    position: fixed;
    width: 100%;
    z-index: 10999;
    opacity: 0.9;
    display: none;
}

.lbMain
{
    position: absolute;
    width: 640px; height: 340px;
    display: none;
}

    .lbImage
    {
        padding: 5px;
        position: absolute;
        line-height: 0;
        text-align: center;
        z-index: 11000;
        border: solid 15px #369;
    }
